<template>
    <div class="app">
      <h1>通用图表组件</h1>
      <Chart
        :option="barOption"
        width="600px"
        height="400px"
        theme="light"
        :autoresize="true"
      />
    </div>
  </template>
  
  <script setup>
  import Chart from '../components/Chart.vue'
  import { ref } from 'vue'
  
  const barOption = ref({
    title: {
      text: '销量柱状图'
    },
    tooltip: {},
    legend: {
      data: ['销量']
    },
    xAxis: {
      data: ['苹果', '香蕉', '橙子', '草莓', '桃子']
    },
    yAxis: {},
    series: [
      {
        name: '销量',
        type: 'bar',
        data: [12, 30, 45, 22, 10]
      }
    ]
  })
  </script>
  